<template>
	<div class="movie-list">
		<scroll :on-infinite="onInfinite" :on-refresh="onRefresh">
			<movie-list title="正在热映" :items="hotMovies" >
			</movie-list>

		</scroll>
		<!-- <div v-if="infiniteCount >= 5" slot="infinite" class="text-center">没有更多数据</div> -->
	</div>
</template>

<script>
	import { mapState } from 'vuex'

	import MovieList from '../components/MovieList'

	export default {
		name: 'movie-list-view',
		components: { MovieList },
		data () {
			return {
				// infiniteCount: 0
			}
		},
		computed: {
			...mapState({
				hotMovies: state => state.hotMovies.hotMovies
			})
		},
		methods: {
			getSouces: function () {
				console.log("222222222222")
				this.$store.dispatch('getHotMovies');
			},
			onRefresh(done) {
				this.$store.commit('refresh');
				this.$store.dispatch('getHotMovies');
				done();
			},
			onInfinite(done) {
				this.$store.dispatch('getHotMovies');
				done();
			}
		},
		created () {
			this.getSouces()
		}
	}
</script>

<style lang="sass" scoped>
	.movie-list {

	}
</style>